'use strict'
import React, { Component, PropTypes } from 'react'




class DescTabs extends Component {

    constructor(props) {
        super(props);
        this.state = {
            tabIndex:0,
			tabs:[
				{title:'概述'},
                {title:'参数'}
			]

        };
    }


    handleClick(index){
    	alert("ddd");
        this.state.tabIndex=index
	}

    tabHeader(index ){
    	console.log("=========="+index);
        return index === this.state.tabIndex ? "on" : "";
    }

    tabBody(index ){
        return index === this.state.tabIndex ? "show" : "hide";
    }


	render(){

    	const _this = this;

		return(

			<div className="descTabsView">
				<a id="anchor" name="tabsAnchor"></a>
				<ul id="tabs" className="tabs flex-row">

					{
						this.state.tabs.map(function(item,index){

							return(

								<li className={'tab '+_this.tabHeader(index)}>
									<a onClick={ () => { _this.setState({ tabIndex : index })} }>{item.title}</a>
								</li>

							)
						})
					}


				</ul>
				<div className="tabs-views">


                    {
                        this.state.tabs.map(function(item,index){

                        	const currenState = _this.tabBody(index);

                            if(index ==0){
                                return(

									<div className={"views "+_this.tabBody(index)}>
										<ul>
											<li>
												<div>
													<div className="img"><img className="lazy" src="//i8.mifile.cn/v1/a1/2416b71e-1d91-8bde-d2bc-c7832ab29702.webp?w=720&amp;h=1055" style={{'transform-origin': '0px 0px 0px', 'opacity': '1', 'transform': 'scale(1, 1)'}}/></div>
												</div>
											</li>
											<li>
												<div>
													<div className="img"><img className="lazy" src="//i8.mifile.cn/v1/a1/73c67c14-cd73-baea-9a9d-4c10a618767a.webp?w=720&amp;h=439" style={{'transform-origin': '0px 0px 0px', 'opacity': '1', 'transform': 'scale(1, 1)'}}/></div>
												</div>
											</li>
										</ul>
									</div>

                                )
                            }else{

                                return(

									<div className={"views "+_this.tabBody(index)}>
										<ul>
											<li>
												<div>
													<div className="img"><img className="lazy" src="//i8.mifile.cn/v1/a1/a310177d-5a2e-a536-e2a5-5ac0eac36598.webp?w=720&amp;h=515"/></div>
												</div>
											</li>
											<li>
												<div>
													<div className="img"><img className="lazy" src="//i8.mifile.cn/v1/a1/550cca7c-2d02-7210-afb9-00e4cbb296e4.webp?w=720&amp;h=467"/></div>
												</div>
											</li>
										</ul>
									</div>

                                )

                            }
                        })
                    }


				</div>
			</div>


    )
	}
}
export default DescTabs